<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>BlackStar Monitor&amp;Profile System</title>
        <meta http-equiv="pragma" content="no-cache" />
        <link rel="stylesheet" type="text/css" href="/static/extjs/resources/css/ext-all.css" rel="stylesheet" />
        <script type="text/javascript" src="/static/extjs/adapter/ext/ext-base.js"></script>
        <script type="text/javascript" src="/static/extjs/ext-all.js"></script>    
        <script type="text/javascript" src="../js/help.js"></script>    
        <script type="text/javascript">
var traceWin;
function showTrace(threadId)
{
    var jvmid = QueryString('jvmid');
    if (!traceWin)
    {
    	var tracePanel = {
            xtype : 'form',  
            labelAlign : 'left',
            buttonAlign : 'right',
            width : '100%', 
            height : '100%', 
            labelWidth : 80,
            items : [{
                        columnWidth : 1,
                        layout : 'form',
                        border : false,
                        items : [{
                                        xtype : 'label',
                                        fieldLabel : '线程名',
                                        id : 'traceThreadName',
                                        anchor : '90%'
                        		},{
                                        xtype : 'label',
                                        fieldLabel : '锁名称',
                                        id : 'traceLockName',
                                        anchor : '90%'
                        		},
                        		{
                                        xtype : 'label',
                                        fieldLabel : '线程信息',
                                        id : 'traceThreadInfo',
                                        anchor : '90%'
                        		},
                        		{
                                        xtype : 'label',
                                        fieldLabel : '堆栈跟踪',
                                        id : 'traceStack',
                                        anchor : '90%'
                        		}
                        	]
                    }]

        };
    	traceWin = new Ext.Window({
	 	   		title:'堆栈',
			    items:tracePanel,      
			    layout:'fit',
			    width:800,
			    height:400,
			    closeAction:'hide',
			    autoScroll : true,
			    plain: true,
			    buttons: [{
			        text: '关闭',
			        handler: function(){
			            traceWin.hide();
			        }
	            }]		                
			});
    }
    
    
    Ext.Ajax.request({
		url: '../thread/' + jvmid + '/' + threadId + '/trace',
		success: function (response,options){
			var data = Ext.util.JSON.decode(response.responseText);	
			Ext.getCmp('traceThreadName').setText(data.threadName);	
			Ext.getCmp('traceLockName').setText(data.lockName);	
			var threadInfo = '状态:' + data.state + '  阻塞次数:' + data.blockedCount + '   等待次数:' + data.waitedCount;
			Ext.getCmp('traceThreadInfo').setText(threadInfo);
			var stack = '';
			for (var i=0;i<data.stacktrace.length;i++)
			{
				if (i> 0)
				{
					stack = stack + '\n';
				}
				stack = stack + data.stacktrace[i];
			}	
			Ext.getCmp('traceStack').setText(stack);	
			traceWin.show(this);
		},
		failure: function(response,options){
			Ext.MessageBox.alert("Error","加载Trace信息出错");
		}
	});
}

var deadLockWin;
var deadLockDataStore;
function showDeadLock(threadId)
{
    var jvmid = QueryString('jvmid');
    if (!deadLockWin)
    {
    	deadLockDataStore = new Ext.data.Store({
     		proxy : 
     			new Ext.data.HttpProxy({url :'../thread/' + jvmid + '/deadlock'}),
     		reader : 
     			new Ext.data.JsonReader({
                  	totalProperty : 'count',
                  	root : 'list'
              		}, [
	                  {name : 'threadId'},
	                  {name : 'threadName'},
	                  {name : 'state'},
	                  {name : 'lockOwnerId'}
                   ]
             	)
		}); 
		var traceRenderer = function(value, cellmeta, record, rowIndex) {
    		return "<a href='javascript:showTrace(" + value + ")'>" + value + "</a>";
    	}
    	var deadLockGridPannel = new Ext.grid.GridPanel({
			store : deadLockDataStore,
        	columns: [
            	{id:'threadId', header: "ID", renderer : traceRenderer, width: 50, dataIndex: 'threadId'},
            	{header: "名称", width: 250, dataIndex: 'threadName'},
           	 	{header: "状态", width: 120,  dataIndex: 'state'},
            	{header: "锁线程", width: 50, renderer : traceRenderer, dataIndex: 'lockOwnerId'}
        	],
        	height:  300,
        	loadMask: {msg:'正在加载数据，请稍侯……'}
    	});
    	
    	
    	deadLockWin = new Ext.Window({
	 	   		title:'死锁检测',
			    items:deadLockGridPannel,      
			    layout:'fit',
			    width:600,
			    height:400,
			    closeAction:'hide',
			    autoScroll : true,
			    plain: true,
			    buttons: [{
			        text: '关闭',
			        handler: function(){
			            deadLockWin.hide();
			        }
	            }]		                
			});
    }
    
    deadLockWin.show(this);
    deadLockDataStore.load();
}

Ext.onReady(function(){
    Ext.QuickTips.init();
	Ext.form.Field.prototype.msgTarget = 'side';

    var jvmid = QueryString('jvmid');
    
    var dataStore = new Ext.data.Store({
     	proxy : 
     		new Ext.data.HttpProxy({url : '../thread/' + jvmid}),
     	reader : 
     		new Ext.data.JsonReader({
                  totalProperty : 'count',
                  root : 'list'
              	}, [
                  {name : 'threadId'},
                  {name : 'threadName'},
                  {name : 'blockedTime'},
                  {name : 'blockedCount'},
                  {name : 'waitedTime'},
                  {name : 'waitedCount'},
                  {name : 'threadCpuTime'},
                  {name : 'cpuTimePercent'},
                  {name : 'state'}
                   ]
             	)
	});
    dataStore.on('load', function(store, records, options) {
    		Ext.getCmp('threadCount').setText(store.getCount());
    	});
    
    var timeFormat = function(value, cellmeta, record, rowIndex) {
    	return value + "ms";
    }
    var percentFormat = function(value, cellmeta, record, rowIndex) {
    	return value + "%";
    }
    
    var operatRenderer = function(value, cellmeta, record, rowIndex) {
    	return "<a href='javascript:showTrace(" + value + ")'>堆栈</a>";
    }
    
	var mainInfo = {
            xtype : 'fieldset',        
            labelAlign : 'left',
            title : '线程信息',
            buttonAlign : 'right',
            width : '98%',
            labelWidth : 80,
            items : [{
                        layout : 'column', 
                        border : false,
                        labelSeparator : '：',
                        items : [{
                                    columnWidth : 0.4,
                                    layout : 'form',
                                    border : false,
                                    items : [{ 
                                        xtype : 'label',
                                        fieldLabel : '线程数',
                                        id : 'threadCount',
                                        anchor : '90%'
                                    }]
                                }, {
                                    columnWidth : 0.1,
                                    layout : 'column',
                                    border : false,
                                    items : [{
                                    	xtype : 'button',
								     	text:"更新",
							        	tooltip : '更新线程列表信息',
								     	handler: function() {
								    		dataStore.load();
								     	}
								    }]
                                }, {
                                    columnWidth : 0.5,
                                    layout : 'column',
                                    border : false,
                                    items : [{
                                    	xtype : 'button',
								     	text : "死锁检查",
							        	tooltip : '线程死锁检查',
								     	handler: showDeadLock
								    }]
                                }]
                    }]

        };
            
    var gridPannel = new Ext.grid.GridPanel({
		store : dataStore,
        columns: [
            {id:'threadId', header: "ID", sortable: true, width: 50, dataIndex: 'threadId'},
            {header: "名称", width: 250, sortable: true, dataIndex: 'threadName'},
            {header: "阻塞时间", width: 100, sortable: true, hidden : true,align: 'right', renderer:timeFormat, dataIndex: 'blockedTime'},
            {header: "阻塞次数", width: 70, sortable: true, align: 'right',dataIndex: 'blockedCount'},
            {header: "等待时间",width: 100,  sortable: true, hidden : true, align: 'right', renderer:timeFormat, dataIndex: 'waitedTime'},
            {header: "等待次数", width: 70, sortable: true, align: 'right',dataIndex: 'waitedCount'},
            {header: "CPU时间", width: 100, sortable: true,align: 'right', renderer:timeFormat,dataIndex: 'threadCpuTime'},
            {header: "CPU比例", width: 70, sortable: true,align: 'right', renderer:percentFormat,dataIndex: 'cpuTimePercent'},
            {header: "状态", width: 120,  sortable: true, dataIndex: 'state'},
            {header: "操作", width: 120, renderer : operatRenderer, dataIndex: 'threadId'}
        ],
		width:  '100%',
        height:  450,
        loadMask: {msg:'正在加载数据，请稍侯……'}
    	});
    	
    dataStore.load();
    
    var viewport = new Ext.Viewport({   
        layout:'border',
        items:[
         {
         	  bodyStyle: 'padding:20px;',
         	  layout:'vbox',
		      region:"center",    
		      items:[mainInfo,gridPannel]
		      } 
         ]
    });
});
        </script>
    </head>
    <body style="padding: 10px;"></body>
</html>